<script setup>
import {defineProps} from 'vue'
import {useRouter} from 'vue-router'

let router = useRouter();
let props = defineProps({
  list: Array
})
const jump = (index) => {
  if (index === 0) {
    router.push({
      name: 'mystarstore',
    })
  }
  else if (index === 1) {
    router.push({
      name: 'shopcar',
    })
  }
  else if (index === 2) {
    router.push({
      name: 'mybalance',
    })
  }
  else if (index === 3) {
    router.push({
      name: 'myaddress',
    })
  }
}
</script>

<template>
  <div class="mymessage" v-for="(item,index) in list" @click="jump(index)">
    <div class="img">
      <img :src="item.src">
    </div>
    <div class="text">
      {{ item.text }}
    </div>
    <div class="gt">
      <span>&gt</span>
    </div>
  </div>
</template>

<style scoped>
.mymessage {
  border-bottom: 0.5px solid #EBEBEB;
  padding: 32px;
  display: flex;
  justify-content: left;
  align-items: center;
}

.gt {
  font-size: 40px;
  position: absolute;
  right: 29px;
  color: #999999;
}

.text {
  font-size: 26px;
}

.img {
  display: flex;
  justify-content: center;
  align-items: center;
}

.img img {
  margin-right: 20px;
  width: 40px;
}
</style>